<!DOCTYPE html>
<html>
  
  <head>
    <meta charset="UTF-8">
    <title>房联行增值服务部后台管理中心</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
    <link rel="stylesheet" href="./css/font.css">
    <link rel="stylesheet" href="./css/xadmin.css">
    <script type="text/javascript" src="js/jquery-2.1.1.min.js"></script>
    <script type="text/javascript" src="./lib/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="./js/xadmin.js"></script>
    <!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
    <!--[if lt IE 9]>
      <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
      <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
  </head>
  <body>
    <div class="x-nav">
      <span class="layui-breadcrumb">
        <a href="">首页</a>
        <a href="">定制图管理</a>
        <a>
          <cite>定制图列表</cite></a>
      </span>
      <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" href="javascript:location.replace(location.href);" title="刷新">
        <i class="layui-icon layui-icon-refresh-1" style="line-height:30px"></i>
      </a>
    </div>
    <div class="x-body">
    	<div class="layui-row">
				<form class="layui-form layui-col-md12 x-so">
					<div class="layui-form-item">
						<div class="layui-inline" style="float:left">
					    	<label class="layui-form-label">选择地区</label>
			                <div class="layui-input-inline">
			                    <select name="provid" id="provid" lay-filter="provid">
			                        <option value="">请选择省</option>
			                    </select>
			                </div>
			                <div class="layui-input-inline">
			                    <select name="cityid" id="cityid" lay-filter="cityid">
			                        <option value="">请选择市</option>
			                    </select>
			                </div>
			                <div class="layui-input-inline">
			                    <select name="areaid" id="areaid" lay-filter="areaid">
			                        <option value="">请选择县/区</option>
			                    </select>
			                </div>
				    	</div>
				    	<div class="layui-inline">
				    		<label for="desc" class="layui-form-label">风格：</label>
							<div class="layui-input-inline">
								<select name="ad-space">
						        <option value="">全部</option>
						        <option value="风格1" selected="">风格1</option>
						        <option value="风格2">风格2</option>
						        <option value="风格3">风格3</option>
						    </select>
							</div>
				    	</div>
				    	
				    	<div class="layui-inline">
				    		<label for="desc" class="layui-form-label">标签：</label>
							<div class="layui-input-inline">
								<select name="ad-space">
						        <option value="">全部</option>
						        <option value="风格1" selected="">风格1</option>
						        <option value="风格2">风格2</option>
						        <option value="风格3">风格3</option>
						    </select>
							</div>
				    	</div>
				    	
				    	<div class="layui-inline">
					        <label class="layui-form-label">创建时间：</label>
					        <div class="layui-input-inline" style="width: 100px;">
					        	<input type="text" name="start" id="start" placeholder="开始日期" autocomplete="off" class="layui-input">
					        </div>
					        <div class="layui-form-mid">-</div>
					        <div class="layui-input-inline" style="width: 100px;">
					        	<input type="text" name="end" id="end" placeholder="结束日期" autocomplete="off" class="layui-input">
					        </div>
					    </div>
				    </div>
				    
				    <div class="layui-form-item">
					    <div class="layui-inline" style="float:left">
					        <label class="layui-form-label">设计收费：</label>
					        <div class="layui-input-inline" style="width: 100px;">
					        	<input type="text" name="price_min" placeholder="￥" autocomplete="off" class="layui-input">
					        </div>
					        <div class="layui-form-mid">-</div>
					        <div class="layui-input-inline" style="width: 100px;">
					        	<input type="text" name="price_max" placeholder="￥" autocomplete="off" class="layui-input">
					        </div>
					    </div>
					    
					    <div class="layui-inline" style="float:left">
					    	<input type="text" name="username" placeholder="请输入姓名或手机号" autocomplete="off" class="layui-input">
					    </div>
					    <div class="layui-inline" style="float:left">
					    	<button class="layui-btn layui-bg-green" lay-submit="" lay-filter="sreach"><i class="layui-icon">&#xe615;</i></button>
					    	<button class="layui-btn layui-bg-orange" type="reset">重置</button>
					    </div>
				    </div>
				</form>
			</div>
			<!--<xblock>
				<button class="layui-btn layui-btn-sm layui-btn-danger" onclick="delAll()"><i class="layui-icon"></i>批量删除</button>
				<button class="layui-btn layui-btn-sm" onclick="x_admin_show('添加定制图','./gallery-add.html')"><i class="layui-icon"></i>添加定制图</button>
				<button class="layui-btn layui-btn-sm layui-btn-normal" onclick="onshelves()"><i class="layui-icon ">&#xe619;</i>批量上架</button>
				<button class="layui-btn layui-btn-sm layui-btn-normal" onclick="offshelves()"><i class="layui-icon"></i>批量下架</button>
				<span class="x-right" style="line-height:40px">共有数据：88 条</span>
			</xblock>  -->
			<script type="text/html" id="toolbarDemo">
				<div class="layui-btn-container">
					<button class="layui-btn layui-btn-sm" lay-event="getCheckData">获取选中行数据</button>
					<button class="layui-btn layui-btn-sm" lay-event="getCheckLength">获取选中数目</button>
					<button class="layui-btn layui-btn-sm" lay-event="isAll">验证是否全选</button>
				</div>
			</script>
 <form class="layui-form">
<table class="layui-table" lay-data="{height: 'full-200', url:'gallery.json', page:true, id:'idTest',toolbar: '#toolbarDemo'}" lay-filter="demo">
  <thead>
    <tr>
      <th lay-data="{type:'checkbox', fixed: true, fixed: 'left'}"></th>
      <th lay-data="{field:'id', width:80, sort: true, fixed: true, fixed: 'left'}">ID</th>
      <th lay-data="{field:'sort', width:80, sort: true, edit: 'text'}">排序</th>
      <th lay-data="{field:'type', width:80}">图片类型</th>
      <th lay-data="{field:'Designer', width:100}">设计机构</th>
      <th lay-data="{field:'tel', width:180}">联系电话</th>
      <th lay-data="{field:'address', width:180}">地址</th>
      <th lay-data="{field:'price', width:100}">设计收费</th>
      <th lay-data="{field:'datetime', width:150, sort: true}">创建时间</th>
      <th lay-data="{field:'style', width:80}">风格</th>
      <th lay-data="{field:'room', width:100}">空间</th>
      <th lay-data="{field:'img', width:150,templet:'#imgurl'}">缩略图</th>
      <th lay-data="{field:'status', width:100, fixed: 'right',templet:'#img_status'}">图片管理</th>
      <th lay-data="{fixed: 'right', width:178, align:'center', toolbar: '#barDemo'}">操作</th>
    </tr>
  </thead>
</table>
</form>
</div>
<script type="text/html" id="imgurl">
<img src="{{d.img}}" width="60" height="40"/>
</script>
<script type="text/html" id="barDemo">
  <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="edit" onclick="x_admin_show('编辑','gallery-edit.html')" href="javascript:;">编辑</a>
  <a class="layui-btn layui-btn-xs layui-btn-normal status" lay-event="status">启用</a>
  <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
  <!-- 这里同样支持 laytpl 语法，如： -->
</script>
<script>
layui.use('table', function(){
  var table = layui.table;
  //监听表格复选框选择
	table.on('checkbox(demo)', function(obj){
    console.log(obj)
  });
  //监听工具条
	table.on('tool(demo)', function(obj){
    var data = obj.data;
    //编辑
    if(obj.event === 'edit'){
     // layer.msg('ID：'+ data.id + ' 的查看操作');
    } 
    //删除
    else if(obj.event === 'del'){
      layer.confirm('确定要删除吗', function(index){
        obj.del();
        layer.close(index);
      });
    } 
    //状态
    else if(obj.event === 'status'){
    // layer.alert('编辑行：<br>'+ JSON.stringify(data))
		    if($(this).text() == '停用')
		    {
		    	$(this).text('启用');
					$(this).addClass('layui-btn-normal').removeClass('layui-btn-warm');
					$(this).parent().parent().prev("td").find("div").html('启用中');
		    }
		    else if($(this).text() == '启用')
		    {
		    	$(this).text('停用');
					$(this).addClass('layui-btn-warm').removeClass('layui-btn-normal');
					$(this).parent().parent().prev("td").find("div").html('已停用');
		    }
    }
    
    
  });
  
    //头工具栏事件
  table.on('toolbar(test)', function(obj){
    var checkStatus = table.checkStatus(obj.config.id);
    switch(obj.event){
      case 'getCheckData':
        var data = checkStatus.data;
        layer.alert(JSON.stringify(data));
      break;
      case 'getCheckLength':
        var data = checkStatus.data;
        layer.msg('选中了：'+ data.length + ' 个');
      break;
      case 'isAll':
        layer.msg(checkStatus.isAll ? '全选': '未全选');
      break;
    };
  });
});
</script>
  </body>
</html>